<template>
<div class="success-main">
	 <div class="success-header">
      <div class="successDescribe">
         <div class="describe"><span>温馨提示</span></div>
      </div>
   </div>
   <div class="success-contain">
     <div class="tip-success">您已成功报班!</div>
     <div class="success-detail">
     <div class="massage-sign">报班消息</div>
     <ul>
       <li>
         <p>学校：{{successData.schoolName}}</p>
         <p>期数：{{successData.classCode}}</p>
         <p>班级：{{successData.classType}}班</p>
       </li>
       <li>
         <p>培训时间：{{successData.beginTime}}</p>
         <p>学习时间：{{successData.duration}}天</p>
       </li>
       <li>
         <p>招生人数：{{successData.planCount}}人</p>
         <p>剩余名额：{{successData.laset}}人</p>
       </li>
     </ul>
    </div>
    <div class="tip-item">提示:请于当日上午9:00整,准时到学校报到!</div>
    <div class="j-cancle" @click='cancle'>关闭页面</div>
   </div>
    <toast :show.sync="show2" type="success" :time="500">处理成功</toast>
</div>
</template>
<script>
import Dialog from 'vux-components/dialog'
import XButton from 'vux-components/x-button'
import loading from 'vux-components/loading'
import toast from 'vux-components/toast'
import Client from '../client.js'
export default {
  name: 'successDetail',
  components: {
    Dialog,
    XButton,
    loading,
    toast
  },
  ready(){
    this.renderData();
  },
  data () {
    return {
      title: '班级',
      showNoScroll:false,
      showitem:true,
      show2:false,
      successData:[],
    }
  },
  methods: {
   cancle:function(){
    // this.$router.go('/classDetail');
    // this.show2 = true;
    wx.closeWindow();
   },
   renderData:function(){
     Client.doGet(Client.apiUrl.signEd,(data) => {
          // success callback
           this.successData = data.data;
           console.log(this.successData);
        },(err) =>{
          // error callback
          console.log(err);
        })
   },
  },
}
</script>
<style lang="scss">
 div,ul,li,p,span,a{
    padding:0;
    margin:0 auto;
  }
.success-main{
  background: #ebebeb;
  height:auto;
  
}
.success-header{
  width: 100%;
  padding: 0 .5rem;
  height: 2.95rem;
  background: #f6f5f5;
  -webkit-box-shadow: 0px 3px 5px #ccc;
   box-shadow: 0px 3px 5px #ccc;

  .successDescribe{
  width:100%;
  height:100%;
  line-height: 2.95rem;
  background: url(../assets/images/line.png) repeat-x  center;
}
.describe{
  width:6rem;
  height:100%;
  line-height: 2.95rem;
  background:#f6f5f5;
  font-size: .9rem;
  color: #438ac9;
  font-weight: bold;
}
.describe span{
  display: inline-block;
  width:100%;
  height:2.95rem;
  line-height: 2.95rem;
  background: url(../assets/images/icon_face.png) no-repeat  .5rem .85rem;
  background-size: 1.1rem;
  padding-left:1.9rem;
}
}
.success-contain{
  width:100%;
  height:auto;
  padding:0 .5rem;
  .tip-success{
    width:100%;
    height: 3.6rem;
    line-height: 3.6rem;
    font-size: .9rem;
    font-weight: bold;
    color:#438ccc;
  }
  .success-detail{
    width:100%;
    height:auto;
    background:#ffffff; 
    .massage-sign{
      width:100%;
      height:2.25rem;
      line-height: 2.25rem;
      background:#8bc1f2;
      color: #fff;
      text-align:center;
    }
    ul{
      width:100%;
      height:auto;
      li{
        width:100%;
        height:auto;
        padding:.7rem .75rem;
        border-top:1px solid #dddddd;
        font-size: .75rem;
        p{
          width:100%;
          height:1.35rem;
          line-height: 1.35rem;
        }
      }
      li:first-child{
        border-top:0px;
      }
    }
  }
  .tip-item{
    width:100%;
    height:2.4rem;
    line-height: 2.4rem;
    font-size: .75rem;
    color: #666;
    padding-left: .2rem;
  }
  .j-cancle{
    width:100%;
    height:2.5rem;
    line-height: 2.5rem;
    text-align: center;
    color: #fff;
    font-size: .9rem;
    background:#4389ca;
    border-radius: .25rem;
    margin: .7rem 0;
  }
  
}


</style>